<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>异步操作</title>
	</head>
	<script src="https://cdn.bootcss.com/jquery/3.4.1/jquery.min.js"></script>
	<body>
	</body>
	<script>
		// 1.查出当前的用户信息
		// 2. 根据当前用户的id查询它的课程
		// 3. 根据当前课程id查询分数

		$.ajax({
			url: "mock/user.json",
			success(data) {
				console.log("查询用户", data);


				$.ajax({
					url: `mock/user_corse_${data.id}.json`,
					success(data) {
						console.log("查询到课程", data);
						$.ajax({
							url: `mock/corse_score_${data.id}.json`,
							success(data) {
								console.log("查询到分数", data);
							},
							error(error) {

								console.log("查询分数出现异常", error);
							}
						});
					},
					error(error) {

						console.log("查询课程出现异常", error);
					}
				});



			},
			error(error) {
				console.log("出现异常了", error);
			}
		});




		//Promise可以封装异步操作
		let p = new Promise((resolve, reject) => { //传入成功解析,失败则拒绝

			// 1.异步操作

			$.ajax({

				url: "mock/user.json",
				success(data) {
					console.log("查询到用户:", data);
					resolve(data);
				},
				error(error) {
					reject(error);
				}
			});
		});

		//成功之后做什么
		p.then((obj) => {
			return new Promise((resolve, reject) => {

				$.ajax({

					url: `mock/user_corse_${obj.id}.json`,
					success(data) {
						console.log("查询到用户课程:", data);
						resolve(data);
					},
					error(error) {
						reject(error);
					}
				});
			});

		}).then((obj) => {
			return new Promise((resolve, reject) => {

				$.ajax({

					url: `mock/corse_score_${obj.id}.json`,
					success(data) {
						console.log("查询到用户分数:", data);
						resolve(data);
					},
					error(error) {
						reject(error);
					}
				});
			});
		})



		// 自己定义一个方法整合一下
		function get(url, data) {
			return new Promise((resolve, reject) => {

				$.ajax({
					url: url,
					data: data,
					success(data) {

						resolve(data);
					},
					error(error) {
						reject(error);
					}
				});
			});
		}



		get("mock/user.json")
			.then((data) => {

				console.log("查询到用户", data);
				return get(`mock/user_corse_${data.id}.json`);
			}).then((data) => {
				console.log("查询到课程",
					data);
				return get(`mock/corse_score_${data.id}.json`);
			}).then((data) => {

				console.log("查询到分数", data);
			}).catch((error) => {

				console.log("出现异常", error);;
			});
	</script>
</html>
